<template>


<div>
    <!-- 添加题库Form -->

<el-dialog title="" :visible.sync="dialogFormVisible">
  <el-form :model="form">
    <el-form-item label="题库名称" :label-width="formLabelWidth">
      <el-input v-model="form.qName" autocomplete="off"></el-input>
    </el-form-item>

  </el-form>



  <div slot="footer" class="dialog-footer">
    <el-button @click="dialogFormVisible = false">取 消</el-button>
    <el-button type="primary" @click="AddQuestion(),Updatequetion(),dialogFormVisible = false">确 定</el-button>
  </div>
</el-dialog>
 <!-- 查看题库Form -->
<el-dialog title="" :visible.sync="dialogTableVisible" >
  <el-table :data="gridData">
    <el-table-column property="id" label="序号" width="150"></el-table-column>
    <el-table-column property="qName" label="子名称" width="200"></el-table-column>
    
  </el-table>
</el-dialog>

<!-- 添加试题Form -->
<el-dialog title="" :visible.sync="dialogTableVisibles" >
  <el-table :data="gridData">
    <el-table-column property="id" label="序号" width="150"></el-table-column>
    <el-table-column property="qName" label="子名称" width="200"></el-table-column>
    <el-table-column  label="操作" width="200">
      <template slot-scope="scope">
        <el-link type="primary" @click="create(scope.row.id),dialogquestion=true">编辑</el-link>
      </template>
    </el-table-column>
  </el-table>
</el-dialog>

<!--form表单代码-->
<el-dialog title="" :visible.sync="dialogquestion" >
  

<div>
  <fm-making-form 
  ref="makingform" 
  style="height: 500px;" 
  preview 
  generate-code 
  generate-json
>
</fm-making-form>
<div>
  <el-input v-model="names" placeholder="请输入内容"></el-input>
   <el-button @click="Add(),dialogquestion=false">提交表单</el-button>
   
</div>
</div>



</el-dialog>

      <el-input v-model="ordername" style="width:200px;float:left" placeholder="请输入要查询的课程"></el-input>
    <el-button type="primary" @click="QuestionList()" style="float:left"  plain>查询</el-button>
     <el-button type="primary" @click="dialogFormVisible = true" style="float:left"  plain>+添加题库</el-button>
      <el-table
    :data="tableData"
    stripe
    style="width: 100%">
    <el-table-column
      prop="id"
      label="序号"
      width="180">
    </el-table-column>
    <el-table-column
      prop="qName"
      label="课程名称"
      width="180">
    </el-table-column>
    <el-table-column
      prop="createTime"
      label="创建时间">
    </el-table-column>
    <el-table-column

      label="操作">
      <template slot-scope="scope">
          <el-link type="primary" @click="dialogTableVisibles = true,Createquetion(scope.row.id)">添加试题</el-link>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-link type="primary" @click="dialogTableVisible = true,Findquetion(scope.row.id)">查看</el-link>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-link type="primary" @click="deletequetion(scope.row.id)">删除</el-link>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <el-link type="primary" @click="FindquetionOne(scope.row),dialogFormVisible = true">编辑</el-link>
      </template>
    </el-table-column>
  </el-table>
</div>

</template>

<script>
  export default {
    data() {
      return {
           gridData: [],
           dialogquestion:false,
           dialogTableVisibles: false,
        dialogTableVisible: false,
            dialogFormVisible: false,
        form: {
        id:"",
          qName: '',

        },
        formLabelWidth: '120px',
          ordername:"",
        tableData: [],
         names:'',
      table:{
         qId:'',
         tId:'',
        names:'',
        text:'',
      }
      }
    },
    mounted(){
        this.QuestionList();
    },
    methods:{
      //添加试题
     Createquetion(id)
     {
       alert(id)
       localStorage.setItem('qid',id);
        this.axios
            .get("https://localhost:44347/QuestionFind?id="+id)
            .then(s=>{
                this.gridData=s.data;
                
            })
     },
     create(id)
     {
       alert(id)
       localStorage.setItem('kid',id);
     },

      handleSubmit () {
      
      this.$refs.generateForm.getData().then(data => {
        alert(JSON.stringify(data))
      }).catch(e => {
      })
    },
    Add(){
      var json = this.$refs.makingform.getJSON();
      this.table.qId= localStorage.getItem('qid');
      this.table.tId= localStorage.getItem('kid');
      this.table.names = this.names;
      this.table.text = JSON.stringify(json)
      console.log(this.table);
      this.axios.post('https://localhost:44347/CreateTK',this.table)
      .then(Response=>{
        if(Response.data>0)
        {
          alert("提交成功");
        }
      })
    },
        //查看
        Findquetion(id)
        {
            this.axios
            .get("https://localhost:44347/QuestionFind?id="+id)
            .then(s=>{
                this.gridData=s.data;
            })
        },


         FindquetionOne(row)
         { 
          
            this.axios
           .get("https://localhost:44347/QuestionFindOne?id="+row.id)
           .then(s=>{
               
               this.form.qName=s.data.qName;
                localStorage.setItem('quetionid',row.id)
               
              
                
           })
            
        },
        Updatequetion()
        {
            this.form.id=localStorage.getItem('quetionid')
             this.axios
               .post("https://localhost:44347/UpdateQuestion",this.form)
               .then(s=>{
                
                  this.form.qName=s.data.qName
                    this.$notify({
                    title: '编辑成功',

                    type: 'success'
                    });
                    this.QuestionList();
                     
               })
        },
        deletequetion(id)
        {
            this.axios
             .delete("https://localhost:44347/RemoveQuestion?id="+id)
             .then(s=>{
                
                      if(s.data==1)
                {
                      this.$notify({
                    title: '删除成功',

                    type: 'success'
                    });
                     this.QuestionList();

                }
                else
                {
                    this.$notify.error({
                                title: '删除失败',

                        });
                         this.QuestionList();
                }
                 
             })
        },
       
    previewHide(){
      this.previewVisible = false;
    },
    handleDataChange () {
    },

        AddQuestion(){
            this.axios
            .post("https://localhost:44347/AddQuery",this.form)
            .then(s=>{
                if(s.data==1)
                {
                      this.$notify({
                    title: '添加成功',

                    type: 'success'
                    });
                     this.QuestionList();

                }
                else
                {
                    this.$notify.error({
                                title: '添加失败',

                        });
                         this.QuestionList();
                }
            })
        },
        QuestionList(){
            this.axios
            .get("https://localhost:44347/QuestionList?qName="+this.ordername)
            .then(s=>{
                this.tableData=s.data;
            })
        }
    }
  }
</script>